import React, { Component } from 'react';
import App from 'layout/App.js'
import { FormControl, Button, Table, Pagination, Modal, Radio, Select, Popconfirm, Breadcrumb, Row, Col} from 'tinper-bee';
import { addWorkFileList, getManagerList, getUserBaseDataUrl, searchOrgs, searchWorkProList } from './workarchives.config.js';
import CommonModal from './../../components/ProjectFilesModal/index.jsx';
import MapModal from './../../components/ProjectMap/mapModal.jsx';
import ManagerModalContent from './ManagerModalContent.jsx';
import EnterpriseModalContent from './EnterpriseModalContent.jsx';
import MemberModalContent from './MemberModalContent.jsx';
import { vendorsDanger as danger, vendorsSuccess as success, vendorsFmtDate as fmtDate } from 'utils/config.js';
import './index.less';
import zhCN from 'rc-calendar/lib/locale/zh_CN';
import enUS from 'rc-calendar/lib/locale/en_US';
import DatePicker from 'bee-datepicker';
import TreeSelect from 'bee-tree-select';
import 'bee-tree-select/build/TreeSelect.css';
import Switch from 'bee-switch';
import moment from 'moment';
moment.locale('zh-cn');

import jdiwork from '../../utils/jdiwork'
let tenantId;
let cookieStr = document.cookie.split(';').find(cur => cur.indexOf('tenantid=') != -1)
if (cookieStr) {
    tenantId = cookieStr.split('=')[1];
}

export default class AddFileItem extends Component {
	constructor (props){
		super(props);
		this.state = {
			code: '',
			name: '',
			startDate: '',
			endDate: '',
			description: '',
			manager: '',
			checked: false,
			showModal: false,
			contentType: 'normal',
			saveItem: {},
			modalSize: 'sm',
			modalTitle: '',
			managerData: [],
			managerRec: {},
			handlerModalCancel: null,
			handlerModalConfirm: null,
			enterpriseListData: [],
			enterpriseRole: '10',
			enterpriseRoleArray: [],
			enterpriseItem: null,
			userName: '',
			snameDanger: false,
			scodeDanger: false,
			approvalDateDanger: false,
			enterpriseDivIndex: 0,
			membersData: null,
			memberArray: [],
			managerName: '',
			chooseDeleteIndex: null,
			selectValue : '-1',
			orgList: [],
			orgValue:null,
			procedureList: [],
			procedureValue: [],
			mapModalShow: false,
			curLocation: {},
		}
	}
	componentDidMount () {
		this.getUserBaseData();
		sessionStorage.setItem('oldEnterpriseKey', null)
		if (tenantId) {
			this.getOrgs();
			this.getProcedures();
		} else {
			jdiwork().getContext((data) => {
				tenantId = data.tenantid;
				this.getOrgs();
				this.getProcedures();
			});
		}
	}
	getUserBaseData = () => {
		let _me = this;
		getUserBaseDataUrl({'isAjax': 1, 'ieStamp': new Date().getTime()},
			res=>{
				if (res.data.result !== null) {
					_me.setState({
						userName: res.data.result.userName
					});
				} else {
					_me.setState({
						userName: ''
					});
				}
			},
			error=>{}
			)
	}
	getOrgs = () => {
		function dealData(data) {
			data.title = data.sname;
			data.value = data.pkSrc || data.pkTenant;
			data.key = data.pkSrc || data.pkTenant;
			if (data.children) {
				data.children.forEach(cur => {
					dealData(cur);
				})
			}
		}
		let _me = this;
		searchOrgs({ 'isAjax': 1, ieStamp: new Date().getTime(), pkTenant: tenantId })
			.then(function (response) {
				if (response.data.resultCode != 'busi_ex') {
					let data = response.data.result;
					dealData(data);
					_me.setState({
						orgList: [data],
					});

				} else {
					danger({ 'text': response.data.exMsg });
				}
			})
			.catch(error=>{
				console.log(error);
			});
	}
	getProcedures = ()=>{
		let _me = this;
		searchWorkProList({ 'isAjax': 1, 'ieStamp': new Date().getTime(), status: 1 })
		.then(function(res){
			if (res.data.resultCode != 'busi_ex') {
				if(res.data.result.length !== 0){
					let data = res.data.result;
					data&&data.forEach(cur=>{
						cur.key = cur.pkProcedure;
						cur.title = cur.scode+ ' ' +cur.sname;
						cur.value = cur.pkProcedure;
					})
					// 加工后台数据添加 name, key, id 组件组件需要属性
					// _me.loopNextData(data);
					_me.setState({
						procedureList: data
					});
				}
			} else {
				danger({'text': res.data.exMsg})
			}
		})
	}
	getColumns = (type) => {
		let _me = this;
		return [
		 	{ title: "姓名", dataIndex: "userName", className: 'text-overflow', key: "userName", width: '20%' },
		    { title: "电话", dataIndex: "userMobile", className: 'text-overflow', key: "userMobile", width: '40%'},
		    { title: "邮箱", dataIndex: "userEmail", key: "userEmail", width: '20%' },
		    { title: "", dataIndex: "y", key: "y", width: '20%',
			      render (text,rec,index) {
			      	return <div className="table-operation">
						<a href="javascript:;" onClick={_me.handlerDeleteMember(index)}>删除</a>
			      	</div>
			      }
				}
	   ]
	}
	handlerDeleteMember = (index)=>()=>{
		setTimeout(()=>{
			let deleteMemberItem = this.state.enterpriseListData[this.state.enterpriseDivIndex].teamMemberViewVOs[index];
			if(deleteMemberItem.userRole === '0'){
				danger({text: '项目经理不可删除！'})
				return;
			}
			this.state.enterpriseListData[this.state.enterpriseDivIndex].teamMemberViewVOs.splice(index, 1);
			this.setState({
				enterpriseListData: this.state.enterpriseListData
			});
		},0)
	}
	getCompnents = (type = 'normal')=>{
		switch (type) {
			case 'normal':
				return '取消后本次所填信息将会丢失！请确认';
				break;
			case 'enterprise':
				return <EnterpriseModalContent saveEnterpriseItem={this.handlerSaveEnterpriseItem} saveEnterpriseRole={this.handlerSaveEnterpriseRole}/>;
				break;
			case 'organize':
				return <MemberModalContent data = {this.state.membersData} saveMemberItem={this.handlerSaveMemberItem} hasChooseMemberData={this.state.enterpriseListData[this.state.enterpriseDivIndex].teamMemberViewVOs} />;
				break;
			case 'managerModal':
				return <ManagerModalContent saveManagerRecord={this.handlerSaveMangerRecord}/>;
				break;
			case 'enterpriseDelete':
				return '确定是否删除这条信息？'
				break;
		}
	}
	handlerSaveMemberItem=(item)=>{
		this.setState({
			memberArray: item
		});
	}
	handlerMemberConfirm = ()=>{
		let newObj = {};
		let playData = this.state.enterpriseListData[this.state.enterpriseDivIndex].teamMemberViewVOs;
		playData.push(...this.state.memberArray);
		playData.forEach((item, index)=>{
			if(item['userRole'] !== '0'){
				item['userRole'] = this.state.enterpriseRole;
			}
		})
		for(let i =0; i< playData.length;i++){
			if(newObj[playData[i]['userName']]){
				newObj[playData[i]['userName']] ++
				playData.splice(i, 1);
				i--;
			}else{
				newObj[playData[i]['userName']] = 1;
			}
		}
		this.setState({
			enterpriseListData: this.state.enterpriseListData,
			showModal: false
		});
	}
	handlerSaveEnterpriseItem = (item) => {
		this.setState({
			enterpriseItem: item
		});
	}
	handlerSaveEnterpriseRole = (item) => {
		this.setState({
			enterpriseRole: item
		});
	}
	onChange = (d) => {
	}
	onStartSelect = (date)=>{
		if(date !== null){
			this.setState({
				startDate: new Date(date._d).getTime()
			});
		}
	}
	onEndSelect = (date)=>{
		if(date !== null){
			this.setState({
				endDate: new Date(date._d).getTime()
			});
		}
	}
	handlerSaveCode = (e) => {
		let value = e.target.value;
		let regCode= /[^a-zA-Z0-9\_-]+/img;
		value = value.replace(regCode, '');
		if(value.length >= 20){
			value = value.substring(0, 20);
		}
		this.setState({
			code: value
		});
	}
	handlerSaveName = (e) => {
		let value = e.target.value;
		if(value.length >= 50){
			value = value.substring(0, 50);
		}
		this.setState({
			name: value
		});
	}
	handlerSaveDescription = (e) => {
		let value = e.target.value;
		if(value.length >= 300){
			value = value.substring(0, 300);
		}
		this.setState({
			description: value
		});
	}
	handlerSwitchChoose = () =>{
		this.setState({
			checked: !this.state.checked
		});
	}
	onhide = () => {
		this.setState({
			showModal: false
		});
	}
	handlerDeleteClose = () => {
		this.setState({
			showModal: false
		});
	}
	handlerDeleteConfirm = () => {
		this.setState({
			showModal: false
		});
	}
	handlerCreateEnterprise = ()=>{
		this.setState({
			showModal: true,
			contentType: 'enterprise',
			modalTitle: '添加企业',
			modalSize: 'lg',
			handlerModalCancel: this.onhide,
			handlerModalConfirm: this.handlerSaveEnterprise,
			enterpriseItem: null,
			enterpriseRole: '10'
		})

	}
	handlerSaveEnterprise = () =>{
		if(this.state.enterpriseItem === null) return;
		let enterpriseArray = this.state.enterpriseListData;
		let isHasSameEnterprise = false;
		this.state.enterpriseRoleArray.push(String(this.state.enterpriseRole));
		enterpriseArray.forEach((item, index)=>{
			if(item.defaultEntName === this.state.enterpriseItem.name){
				danger({'text': '已经选择了该企业！'});
				isHasSameEnterprise = true;
			}
		})
		if(isHasSameEnterprise) return;
		enterpriseArray.push({
			pkEnterprise: this.state.enterpriseItem.id,
			entRole: this.state.enterpriseRole,
			defaultEntName: this.state.enterpriseItem.name,
			teamMemberViewVOs: []
		});
		this.setState({
			showModal: false,
			enterpriseListData: enterpriseArray,
			enterpriseRoleArray: this.state.enterpriseRoleArray
		});
	}
	handlerSaveItem = () => {
		let param = Object.assign({}, {sname: this.state.name},
										{pkOrg: this.state.orgValue},
									  {approvalDate: this.state.startDate},
									  {endDate: this.state.endDate},
									  {projectState: this.state.selectValue},
									  {scode: this.state.code},
									  {iskey: this.state.checked},
									  {description: this.state.description},
									  {manager: this.state.manager},
									  {procedures: this.state.procedureValue},
									  {address: this.state.curLocation.address},
									  {longitude: this.state.curLocation.lng},
									  {latitude: this.state.curLocation.lat},
									  {managerEnt: this.state.managerRec.pkEnterprise},
									  {teamEnterpriseViewVOs: this.state.enterpriseListData})
		if (param.sname === '' || param.scode === '' || param.approvalDate === '') {
			this.handlerSetBorderStatus(param);
			return false;
		}
		addWorkFileList(param,
		 res=>{
		 		if(res.data.resultCode !== 'busi_ex'){
		 			window.location.href = "./workfile.html";
		 		}else{
		 			danger({text: res.data.exMsg});
		 		}
		 },
		 error=>{}
	 	);
	}
	handlerSetBorderStatus = (data) => {
		for (let name in data) {
			if (data[name] === '') {
				switch(name){
					case 'sname':
					this.setState({
						snameDanger: true
					});
					break;
					case 'scode':
					this.setState({
						scodeDanger: true
					});
					break;
					case 'approvalDate':
					this.setState({
						approvalDateDanger: true
					});
					break;
				}
			} else {
				switch(name){
					case 'sname':
					this.setState({
						snameDanger: false
					});
					break;
					case 'scode':
					this.setState({
						scodeDanger: false
					});
					break;
					case 'approvalDate':
					this.setState({
						approvalDateDanger: false
					});
					break;
				}
			}
		}
	}

	handlerShowManagerModal = () => {
		this.setState({
			showModal: true,
			contentType: 'managerModal',
			modalSize: 'lg',
			modalTitle: '项目经理',
			handlerModalCancel: this.onhide,
			handlerModalConfirm: this.handlerSaveManager
		});
	}
	handlerSaveManager = () =>{
		let enterpriseArray = this.state.enterpriseListData;
		let oldEnterpriseKey = sessionStorage.getItem('oldEnterpriseKey');
		this.state.managerRec['teamMemberViewVOs'] = [{
			pkUser: this.state.managerRec.userId,
			pkEnterprise: this.state.managerRec.pkEnterprise,
			userRole: '0',
			userName: this.state.managerRec.userName,
			userEmail: this.state.managerRec.userEmail,
			userMobile: this.state.managerRec.userMobile
		}];
		let newRec = Object.assign({}, this.state.managerRec, {entRole: '10'})
		enterpriseArray.push(newRec);
		this.state.enterpriseRoleArray.push('10');
		if(oldEnterpriseKey){
			enterpriseArray.forEach((item, index)=>{
				if(item.pkEnterprise === oldEnterpriseKey){
					if(enterpriseArray[index].teamMemberViewVOs.length === 1){
						enterpriseArray.splice(index, 1);
						this.state.enterpriseRoleArray.splice(index, 1);
					}else{
						enterpriseArray[index].teamMemberViewVOs.forEach((item, innerIndex)=>{
							if(item['userRole'] === '0'){
								enterpriseArray[index].teamMemberViewVOs.splice(innerIndex, 1);
							}
						})
					}
				}
			})
		}
		sessionStorage.setItem('oldEnterpriseKey', this.state.managerRec.pkEnterprise)
		this.setState({
			showModal: false,
			enterpriseListData: enterpriseArray,
			manager: this.state.managerRec.userId,
			managerName: this.state.managerRec.userName,
			enterpriseRoleArray: this.state.enterpriseRoleArray
		});
	}
	handlerSaveMangerRecord = (item) => {
		this.setState({
			managerRec: Object.assign({}, item, {pkEnterprise: item.defaultEntId})
		});
	}
	handleChange = (value)=>{
		this.state.enterpriseListData[this.state.enterpriseDivIndex]['entRole'] = value;
		this.state.enterpriseListData[this.state.enterpriseDivIndex]['teamMemberViewVOs'].forEach((item)=>{
			item['userRole'] = value;
		})
		this.state.enterpriseRoleArray[this.state.enterpriseDivIndex] = value
		this.setState({
			defaultValueRole: value,
			enterpriseRoleArray: this.state.enterpriseRoleArray
		})
	}
	handlerCreateMembers = (item, index) => () => {
		let membersData = Object.assign({}, item, {role: this.state.enterpriseRoleArray[index]})
		this.setState({
			showModal: true,
			contentType: 'organize',
			modalSize: 'lg',
			modalTitle: '添加成员',
			membersData,
			handlerModalCancel: this.onhide,
			handlerModalConfirm: this.handlerMemberConfirm
		});
	}
	handlerCancelItem = ()=>{
		this.setState({
			showModal: true,
			contentType: 'normal',
			modalSize: 'sm',
			modalTitle: '',
			handlerModalCancel: this.onhide,
			handlerModalConfirm: this.handlerCancel
		});
	}
	handlerCancel = ()=>{
		window.location.href= "./workfile.html";
	}
	handlerDeleteEnterprise = () => {
		let stop = false;
		let enterpriseData = this.state.enterpriseListData;
		let enterpriseRoleArray = this.state.enterpriseRoleArray;
		let deleteEnterpriseItem = enterpriseData[this.state.chooseDeleteIndex];
		deleteEnterpriseItem.teamMemberViewVOs.forEach((item, index)=>{
			if(item.userRole === '0'){
				danger({text: '存在项目经理的项目不能删除！'});
				stop = true;
			}
			return;
		})
		if(stop) return;
		enterpriseData.splice(this.state.chooseDeleteIndex, 1);
		enterpriseRoleArray.splice(this.state.chooseDeleteIndex, 1);
		this.setState({
			enterpriseListData: enterpriseData,
			enterpriseRoleArray,
			showModal: false
		});
	}
	handlerShowDeleteModal = (index)=>()=>{
		this.setState({
			showModal: true,
			modalSize: 'sm',
			modalTitle: '',
			chooseDeleteIndex: index,
			contentType: 'enterpriseDelete',
			handlerModalCancel: this.onhide,
			handlerModalConfirm: this.handlerDeleteEnterprise
		});
	}
	handlerChooseDivIndex = (index)=>()=>{
		this.setState({
			enterpriseDivIndex: index
		});
	}
    handleDropSearch = (value) =>{
        this.setState({
            selectValue:value
		})
		}
		
	onOrgChange = (value, label, extra) => {
		this.setState({
			orgValue: value
		})
	}
	handleProcedureChange = (a) => {
		this.setState({
			procedureValue: a
		})
	}
	filterProcedures = (val, option) => {
		if(option.props.children.indexOf(val)!=-1){
			return true;
		}
		return false;
	}
	mapModalClose = (lng, lat, address) => {
		document.getElementById('app').style.overflow = "auto";

		this.setState({
			mapModalShow: false
		});
		if (lng) {
			this.setState({
				curLocation:{
					lng,
					lat,
					address,
				}
			})
		}
	}
	openMapModal= ()=>{
		document.getElementById('app').style.overflow = "hidden";
		this.setState({
			mapModalShow: true,
		})
	}
	clearPosition=()=>{
		this.setState({
			curLocation:{
			}
		})
	}
	render (){
		let { code, name, description, checked, showModal, contentType, modalSize, modalTitle, enterpriseListData, managerName, userName, snameDanger, scodeDanger, approvalDateDanger, enterpriseRoleArray, procedureList } = this.state;
		let procedureData = procedureList.map(cur => {
			return <Select.Option key={cur.pkProcedure}>{cur.scode + ' ' + cur.sname}</Select.Option>
		})
		return (
			<App>
				<CommonModal show={showModal}
		                        cancel={this.state.handlerModalCancel}
		                        confirm={this.state.handlerModalConfirm}
		                        hide={this.onhide}
		                        backdrop={true}
		                        content={this.getCompnents(contentType)}
		                        size={modalSize}
		                        title={modalTitle}
		                        >
           		</CommonModal>
				<div className="header clearfix">
					<div className="bread-crumb">
						<Breadcrumb>
						    <Breadcrumb.Item href="./workfile.html">
						      项目列表
						    </Breadcrumb.Item>
						    <Breadcrumb.Item href="./workaddfileitem.html">
						      创建项目
						    </Breadcrumb.Item>
						</Breadcrumb>
					</div>
					<div className="item-user">
						<p>创建人：{userName}</p>
						<p>创建时间：{fmtDate(new Date())}</p>
					</div>
				</div>
				<div className="basedata--content">
					<div className="base--header clearfix">
						<p>基本信息</p>
						<div className="btn-group">
							<Button colors="primary" onClick={this.handlerSaveItem}>保存</Button>
							<Button onClick={this.handlerCancelItem}>取消</Button>
						</div>
					</div>
					<div className="base--content">
						<Row>
							<Col md={6} xs={6} sm={6}>
								<div className='base--input__group clearfix'>
									<i className="red--icon">*</i>
									<span className="name">项目编码：</span>
			                    	<FormControl size="lg" placeholder="20个数字、英文以内" onChange={this.handlerSaveCode} value={code} className={ scodeDanger ? 'danger-boder': ''}/>
			                    	{ scodeDanger ? <b className="notice--tip">内容不能为空</b> : ''}
								</div>
			                </Col>
			                <Col md={6} xs={6} sm={6}>
			                    <div className='base--input__group clearfix'>
			                    	<i className="red--icon">*</i>
									<span className="name">项目名称：</span>
			                    	<FormControl size="lg"  placeholder="50个汉字、英文、数字、符号以内" onChange={this.handlerSaveName} value={name} className={ snameDanger? 'danger-boder': ''} />
			                    	{ snameDanger ? <b className="notice--tip">内容不能为空</b> : ''}
								</div>
			                </Col>
			                <Col md={6} xs={6} sm={6}>
			                    <div className='base--input__group clearfix'>
									<span className="name">项目经理：</span>
			                    	<FormControl size="lg"  placeholder={'请点击选择！'} onClick={this.handlerShowManagerModal} value={managerName}/>
								</div>
			                </Col>
			                <Col md={6} xs={6} sm={6}>
								<div className='base--input__group clearfix'>
									<i className="red--icon">*</i>
									<span className="name">项目状态：</span>
									<Select className='base--input__dropInput '
											defaultValue={this.state.selectValue}
											onSelect={this.handleDropSearch}
									>
										<Select.Option value="-1">创建 </Select.Option>
										<Select.Option value="0">施工中</Select.Option>
										<Select.Option value="1">竣工</Select.Option>
										<Select.Option value="-2">暂停 </Select.Option>
									</Select>
								</div>
			                </Col>
			                <Col md={6} xs={6} sm={6}>
			                    <div className='base--input__group clearfix'>
			                    	<i className="red--icon">*</i>
									<span className="name">立项日期：</span>
			                    	<DatePicker
			                            format={"YYYY-MM-DD"}
			                            onSelect={this.onStartSelect}
			                            onChange={this.onChange}
			                            locale={zhCN}
			                            placeholder = {'选择日期时间'}
			                            className={ approvalDateDanger ? 'danger-boder': ''}
			                        />
			                        { approvalDateDanger ? <b className="notice--tip">内容不能为空</b> : ''}
								</div>
			                </Col>
			                <Col md={6} xs={6} sm={6}>
								<div className='base--input__group clearfix'>
									<span className="name">重点项目：</span>
									<Switch checked={checked} onChange={this.handlerSwitchChoose}/>
									<div className='base--input__closeTime'>
										<span></span>
										<span style={{marginLeft:'6px'}}></span>
									</div>
								</div>
			                </Col>
								<Col md={6} xs={6} sm={6}>
								<div className='base--input__group clearfix'>
									<span className="name">项目组织：</span>
									<TreeSelect
										// allowClear = {true}
										className={'base--input__dropInput'}
										value={this.state.orgValue}
										treeData={this.state.orgList}
										placeholder="请选择组织"
										treeDefaultExpandAll
										onChange={this.onOrgChange}
										dropdownMatchSelectWidth
										showSearch
										notFoundContent = "没有相关条目"
										treeNodeFilterProp = "title"
										size = "large"
									/>
								</div>
							</Col>
							</Row>
						<Row>
							<Col md={6} xs={6} sm={6}>
							<div className='base--input__group clearfix base--input__groupMutiSelect'>
									<span className="name">适用工序：</span>
								<Select
									multiple
									className={'base--input__MultiSelect'}
									onChange={this.handleProcedureChange}
									placeholder="请点击选择工序"
									// value={this.state.orgValue}
									dropdownMatchSelectWidth
									showSearch
									notFoundContent = "没有相关条目"
									filterOption ={this.filterProcedures}
									// size = "lg"
								 >
									{procedureData}
								</Select>
								</div>
							</Col>
							<Col md={6} xs={6} sm={6}>
								<div className='base--input__group clearfix'>
									<span className="name">项目地址：</span>
									<a href="javascript:;" className='refer-map' onClick={this.openMapModal}>关联地图</a>
									<FormControl className='map-text' size="lg" disabled value={this.state.curLocation.address||''} />
									<i className="clear-position-icon" onClick = {this.clearPosition}></i>
								</div>
							</Col>
							<Col md={12} xs={12} sm={12}>
								<div className='base--input__group clearfix'>
									<span className="name">项目描述：</span>
									<textarea size="lg" placeholder={'请输入'} onChange={this.handlerSaveDescription} />
								</div>
							</Col>

						</Row>
					</div>
				</div>
				<div className="enterprise--basedata">
					<div className="enterprise--header clearfix">
						<p>企业和团队</p>
						<a href="javascript:;" onClick={this.handlerCreateEnterprise}>
							添加企业
							<i className="enterprise--icon"></i>
						</a>
					</div>
					{ enterpriseListData.length !== 0 && 
						enterpriseListData.map((item, index)=>{
							return <div className="enterprise--content" onClick={this.handlerChooseDivIndex(index)}>
										<div className="enterprise--item">
											<div className="item--header">
												<Row>
													<Col md={2} xs={2} sm={2}>
														<Select
												          size="lg"
												          style={{ width: 150, marginLeft: 24, marginTop: 8}}
												          onChange={this.handleChange}
												          placeholder={'请选择'}
												          value={enterpriseRoleArray[index]}
												        >
												          <Option value="10">业主方</Option>
												          <Option value="20">施工方</Option>
												          <Option value="30">监理方</Option>
												        </Select>
													</Col>
													<Col md={10} xs={10} sm={10} className="clearfix">
														<p>{item.defaultEntName}</p>
														<a href="javascript:;" onClick={this.handlerShowDeleteModal(index)}>删除</a>
													</Col>
												</Row>
											</div>
											<div className="item--content">
												<Row>
													<Col md={2} xs={2} sm={2}>
														<p>团队成员</p>
													</Col>
													<Col md={10} xs={10} sm={10}>
														<a href="javascript:;" className="btn--add__member" onClick={this.handlerCreateMembers(item, index)}>
															添加成员
															<i className="member--icon"></i>
														</a>
														<Table data={item.teamMemberViewVOs} columns={this.getColumns()}></Table>
													</Col>
												</Row>
											</div>
										</div>
									</div>
						})
					 }
				</div>
				<MapModal
					show={this.state.mapModalShow}
					onClose={this.mapModalClose}
					initLocation={this.state.curLocation}
				/>
			</App>
			)
	}
}